<extend name="Layout/application"/>
<block name="css">
    <link rel="stylesheet" href="__PUBLIC__/select2/css/select2.min.css">
    <link rel="stylesheet" href="__PUBLIC__/bootstrap-colorpicker/css/bootstrap-colorpicker.min.css">
    <link rel="stylesheet" href="__PUBLIC__/bootstrap-datepicker/css/bootstrap-datepicker3.min.css">

</block>

<block name="content">
    <div class="row">
        <div class="col-md-12">

            <div class="row">
                <div class="col-md-8">
                    <div class="page-header">
                        <h1>系统首页</h1>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-md-10">
                    <div class="panel panel-default">
                        <div class="panel-heading">系统信息</div>

                        <div class="panel-body">
                            <form class="form-horizontal" role="form" method="post"
                                  action="{{:U('do_edit',array(id=>$article['id']))}}">
                                <div class="form-group">
                                    <label for="category" class="col-sm-2 control-label">所属栏目</label>
                                    <div class="col-sm-10">
                                        <select name="category_id" id="category" class="form-control">
                                            <volist name="categories" id="category">
                                                <option value="{{$category.id}}"
                                                <eq name="category.id" value="$article.category_id">selected</eq>
                                                >
                                                {{$category.name}}
                                                </option>

                                                <volist name="category.children" id="c">
                                                    <option value="{{$c.id}}"
                                                    <eq name="c.id" value="$article.category_id">selected</eq>
                                                    >
                                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{$c.name}}
                                                    </option>
                                                </volist>
                                            </volist>

                                        </select>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="title" class="col-sm-2 control-label">标题</label>
                                    <div class="col-sm-10">
                                        <input type="text" class="form-control" name="title" id="title"
                                               placeholder="输入标题" value="{{$article.title}}">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="title_color" class="col-sm-2 control-label">标题颜色</label>
                                    <div class="col-sm-10">
                                        <div id="cp2" class="input-group colorpicker-component">
                                            <input type="text" value="{{$article.title_color}}" name="title_color"
                                                   id="title_color" class="form-control">
                                            <span class="input-group-addon"><i></i></span>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="time" class="col-sm-2 control-label">发布日期</label>
                                    <div class="col-sm-10">


                                        <input type="text" name="time" class="form-control" id="time" placeholder=""
                                               value="{{$article.time|date='Y-m-d',###}}">


                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="title" class="col-sm-2 control-label">缩略图</label>
                                    <div class="col-sm-6">
                                        <input type="text" name="thumb" class="form-control" id="thumb" placeholder=""
                                               value="{{$article.thumb}}">
                                    </div>
                                    <div class="col-sm-4">
                                        <button type="button" class="btn btn-success"
                                                onclick="BrowseServer('thumb','img_show')">上传
                                        </button>

                                        <button type="button" class="btn btn-danger">删除</button>
                                    </div>
                                </div>


                                <div class="form-group">
                                    <label for="title" class="col-sm-2 control-label">预览</label>
                                    <div class="col-sm-10">
                                        <img src="" id="img_show" style="max-height: 120px;"/>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="col-sm-4 col-sm-offset-2">
                                        <button type="button" class="btn btn-primary" id="more_files">添加更多</button>
                                    </div>
                                </div>
                                <div class="files" >
                                    <volist name="article.file" id="a">


                                    <div class="form-group" >
                                        <label for="title" class="col-sm-2 control-label">附件({{$i}})</label>
                                        <div class="col-sm-6">
                                            <input type="text" name="file[]" class="form-control" id="file1"
                                                   placeholder="" value="{{$a}}">
                                        </div>
                                        <div class="col-sm-4">
                                            <button type="button" class="btn btn-success"
                                                    onclick="BrowseServerFile('file1')">上传
                                            </button>

                                            <button type="button" class="btn btn-danger delete_file1">删除</button>
                                        </div>
                                    </div>
                                    </volist>

                                </div>
                                <div class="form-group">
                                    <label for="content" class="col-sm-2 control-label">发布内容</label>
                                    <div class="col-sm-10">
                                        <textarea name="content" class="form-control" id="content" cols="30"
                                                  rows="10">{{$article.content}}</textarea>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="col-sm-offset-2 col-sm-10">
                                        <button type="submit" class="btn btn-danger">提交</button>
                                        <button type="button" class="btn btn-danger" id="return">返回</button>
                                    </div>
                                </div>


                            </form>


                        </div>
                    </div>
                </div>


                <div class="col-md-2">
                    <div class="list-group">
                        <a href="javascript: void 0;" class="list-group-item list-group-item-info sort_category">
                            <span class="glyphicon glyphicon-plus" aria-hidden="true"></span> 新增 (add)
                        </a>

                        <a href="javascript: void 0;" class="list-group-item list-group-item-info sort_category">
                            <span class="glyphicon glyphicon-refresh" aria-hidden="true"></span> 排序 (sort)
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</block>
<block name="js">
    <script src="__PUBLIC__/ckeditor/ckeditor.js"></script>
    <script type="text/javascript" src="__PUBLIC__/ckfinder/ckfinder.js"></script>

    <script src="__PUBLIC__/select2/js/select2.min.js"></script>
    <script src="__PUBLIC__/select2/js/i18n/zh-CN.js"></script>

    <script src="__PUBLIC__/bootstrap-colorpicker/js/bootstrap-colorpicker.min.js"></script>

    <script src="__PUBLIC__/bootstrap-datepicker/js/bootstrap-datepicker.min.js"></script>
    <script src="__PUBLIC__/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js"></script>

    <script>
        //上传图片
        function BrowseServerFile(file) {
            var finder = new CKFinder();

            //当选中图片时执行的函数
            finder.selectActionFunction = function (fileUrl) {
                $("#" + file).val(fileUrl);
            }

            finder.popup();//调用窗口
        }


        $(function () {

            var index = 2;

            $('#more_files').click(function () {

                var length = $('.files').children().length;
                index=length + 1;
                if (length == 5) {
                    alert('您最多只能添加5个附件!');
                    return false;
                }

                var html = '<div class="form-group" class="file' + index + '"> ' +
                        '<label for="title" class="col-sm-2 control-label">附件(' + index + ')</label> ' +
                        '<div class="col-sm-6"> ' +
                        '<input type="text" name="file[]" class="form-control" id="file' + index + '" placeholder=""> ' +
                        '</div> ' +
                        '<div class="col-sm-4"> ' +
                        '<button type="button" class="btn btn-success"' +
                        'onclick="BrowseServerFile(\'file' + index + '\')">上传 ' +
                        '</button> ' +
                        '<button type="button" class="btn btn-danger delete_file">删除</button> ' +
                        '</div> ' +
                        '</div>';

                index++;
                $(".files").append(html);

            });
            $(".delete_file1").click(function () {
                $(this).parents('.form-group').find('input').val('');
            });
            $(document).on('click', '.delete_file', function () {
                $(this).parents('.form-group').remove();
            })


            $('select').select2();

            $('#cp2').colorpicker();


            $('#time').datepicker({
                format: "yyyy-mm-dd",
                language: 'zh-CN'
            });
        });


        CKEDITOR.replace('content',
                {
                    filebrowserBrowseUrl: '__PUBLIC__/ckfinder/ckfinder.html',
                    filebrowserImageBrowseUrl: '__PUBLIC__/ckfinder/ckfinder.html?type=Images',
                    filebrowserFlashBrowseUrl: '__PUBLIC__/ckfinder/ckfinder.html?type=Flash',
                    filebrowserUploadUrl: '__PUBLIC__/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files',
                    filebrowserImageUploadUrl: '__PUBLIC__/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images',
                    filebrowserFlashUploadUrl: '__PUBLIC__/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash'
                });
        //上传图片
        function BrowseServer(thumb, img_show) {
            var finder = new CKFinder();

            //当选中图片时执行的函数
            finder.selectActionFunction = function (fileUrl) {
                $("#" + thumb).val(fileUrl);
                $("#" + img_show).attr("src", "" + fileUrl + "");
            }

            finder.popup();//调用窗口
        }


    </script>


</block>